<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文章正文</title>
    <link rel="stylesheet" href="css/conmmon.css">
    <link rel="stylesheet" href="css/blog_content.css">
    <link rel="stylesheet" href="editor.md/css/editormd.preview.min.css" />
    <link rel="stylesheet" href="css/pinlun.css">
    <script src="js/jquery.min.js"></script>
    <script src="editor.md/editormd.js"></script>
    <script src="editor.md/lib/marked.min.js"></script>
    <script src="editor.md/lib/prettify.min.js"></script>
</head>

<body>
    <!-- 导航栏 -->
    <div class="nav">
        <img src="img/logo.jpg" alt="">
        <span class="title" style="font-size:30px">优文共享社区</span>
        <!-- 用来占据中间位置 -->
        <span class="spacer"></span>
        <a href="login.html">登陆</a>
        <a href="myblog_list.html">个人主页</a>
        <a href="blog_list.html">文章展示页</a>
        <a href="blog_add.html">写文章</a>
        <a href="javascript:logout()">注销</a>
    </div>
    <!-- 版心 -->
    <div class="container">
        <!-- 左侧个人信息 -->
        <div class="container-left">
            <div class="card">
                <div id="imgadd"></div>
                <h3 id="username"></h3>
                <!-- <a href="http:www.github.com">座右铭</a> -->
                <div class="counter">
                    <span>文章数</span>
                </div>
                <div class="counter">
                    <span id="artCount"></span>
                </div>
            </div>

        </div>
        <!-- 右侧内容详情 -->
        <div class=" container-right">
            <div class="blog-content">
                <!-- 博客标题 -->
                <h1 id="title"></h1>
                <!-- 博客时间 -->
                <div class="date" style="font-size: 15px;">发布时间：<span id="updatetime" style="font-size: 15px;"></span>
                    &nbsp;&nbsp;阅读量：<span id="rcount" style="font-size: 15px;"></span>
                </div>
                <!-- 博客正文 -->
                <div id="editorDiv" style="font-size: 18px;">

                </div>
            </div>
        </div>




    </div>

    <!-- 评论区 -->
    <div class="comment-area1">
        <h3>评论区</h3>

        <!-- 发布评论 -->
        <div id="add_comment_form">
            <textarea id="remarkcontent" placeholder="评论内容"></textarea>
            <button type="submit" onclick="addremark()">发表评论</button>
        </div>
        <h3>评论列表</h3>
    </div>
    <div class="comment-area">
        <!-- 评论列表 -->
        <div id="add_remark">

        </div>
    </div>
    </div>

    <script type="text/javascript">
        var editormd;
        function initEdit(md) {
            editormd = editormd.markdownToHTML("editorDiv", {
                markdown: md, // Also, you can dynamic set Markdown text
                // htmlDecode : true,  // Enable / disable HTML tag encode.
                // htmlDecode : "style,script,iframe",  // Note: If enabled, you should filter some dangerous HTML tags for website security.
            });
        }

        //获取url中的内容
        function getUrlValue(key) {
            //获取url中的内容
            var params = location.search;
            if (params.length > 1) {
                params = location.search.substring(1);
                var paramArr = params.split("&");
                for (var i = 0; i < paramArr.length; i++) {
                    var kv = paramArr[i].split("=");
                    if (kv[0] == key) {
                        return kv[1];
                    }
                }
            }
            return "";
        }
        //查询文章详情
        function getArtDetail(id) {
            if (id == "") {
                alert("非法参数！请重试!"); return;
            }
            jQuery.ajax({
                url: "art/detail",
                type: "POST",
                data: { "id": id },
                success: function (result) {
                    if (result != null && result.code == 200) {
                        jQuery("#title").html(result.data.title);
                        jQuery("#updatetime").html(result.data.updatetime);
                        jQuery("#rcount").html(result.data.rcount);
                        initEdit(result.data.content);
                        //用户信息
                        showUser(result.data.uid);
                    } else {
                        alert("查询失败！请重试！");
                    }
                }
            });
        }
        getArtDetail(getUrlValue("id"));

        //查询用户个人信息
        function showUser(id) {
            jQuery.ajax({
                url: "user/getuserbyid",
                type: "POST",
                data: { "id": id },
                success: function (result) {
                    if (result != null && result.code == 200 && result.data.id > 0) {
                        jQuery("#username").html(result.data.username);
                        jQuery("#artCount").html(result.data.artCount);
                    } else {
                        alert("用户信息有误！"); return;
                    }
                }
            });
        }

        //增加阅读量
        function updateRCount() {
            var id = getUrlValue("id");
            if (id != "") {
                jQuery.ajax({
                    url: "/art/incrementrcount",
                    type: "POST",
                    data: { "id": id },
                    success: function (success) {

                    }
                });
            }
        }
        updateRCount();

        //添加评论
        function addremark() {
            var content = jQuery("#remarkcontent");
            var id = getUrlValue("id");
            if (content.val() == "") {
                alert("请先输入评论！");
                return;
            }
            jQuery.ajax({
                url: "user/remarkadd",
                type: "POST",
                data: { "content": content.val(), "id": id },
                success: function (result) {
                    if (result != null && result.code == 200 && result.data == 1) {
                        alert("评论成功！");
                        location.href = location.href;
                    } else if (result != null && result.code == -1 && result.msg == "用户未登录") {
                        alert("请先登陆！");
                    } else {
                        alert("评论失败！");
                    }
                }
            });
        }
        //返回所有人的评论
        function getremark() {
            var id = getUrlValue("id");
            jQuery.ajax({
                url: "/user/remarkall",
                type: "POST",
                data: { "id": id },
                success: function (result) {
                    if (result != null && result.code == 200) {
                        var remarklist = "";
                        for (var i = 0; i < result.data.length; i++) {
                            var remarkone = result.data[i];
                            remarklist += '<ul class="comment-list">';
                            remarklist += '<li class="comment-item">';
                            remarklist += '<div class="comment-info">';
                            remarklist += '<span class="comment-name">'
                                + remarkone.username + '</span>';
                            remarklist += '<span class="comment-time">'
                                + remarkone.createtime + '</span>';
                            remarklist += '</div>';
                            remarklist += '<p class="comment-content">'
                                + remarkone.content + '</p>';
                            remarklist += '</li>';
                            remarklist += '</ul>';
                        }
                        jQuery("#add_remark").html(remarklist);
                    } else if (result != null && result.code == -1) {
                        alert("评论区数据异常");
                    }
                }
            });
        }
        getremark();
        //注销操作（退出登陆状态）
        function logout() {
            if (confirm("确认退出登录？")) {
                jQuery.ajax({
                    url: "/user/logout",
                    type: "POST",
                    data: {},
                    success: function (result) {
                        if (result != null && result.code == 200) {
                            location.href = "/login.html";
                        }
                    }
                });
            }
        }

        //获取头像
        function getimage() {
            var id = getUrlValue("id");
            jQuery.ajax({
                url: "/user/getimgcontent",
                type: "POST",
                data: { "id": id },
                success: function (result) {
                    if (result != null && result.code == 200) {
                        jQuery("#imgadd").html('<img src="img/' + result.data + '" class="avtar" alt="">');
                    } else {
                        jQuery("#imgadd").html('<img src="img/no.jpg" class="avtar" alt="">');
                    }
                }
            });
        }
        getimage();
    </script>
</body>

</html>